<template>
    <div>
        <component :is="one"></component>

        <div id="container">
            <div id="content2">
                <table width="100%" height="41" border="0" align="center" cellpadding="0" cellspacing="0">
                    <tr>
                        <td width="15" height="18" align="left" valign="top">
                            <div align="left"></div>
                        </td>
                        <td width="385" align="left" valign="bottom" class="12">&nbsp;</td>
                    </tr>
                    <tr>
                        <td height="4" colspan="2" align="left" valign="bottom"></td>
                    </tr>
                    <tr>
                        <td height="15" align="left" valign="top">&nbsp;</td>
                        <td height="15" align="left" valign="top" class="12">
                            <table width="100%" height="20" border="0" cellpadding="0" cellspacing="0">
                                <tr>
                                    <td height="20" align="center">
                                        <div class="right_proaducts">
                                            <div align="left">我的位置&gt;&gt;科技项目申报&gt;修改本帐户密码</div>
                                        </div>
                                        <!--      <form action="unit_index.html" method="post" id="form" onsubmit="return checkExpertPassword(this)">-->
                                        <!-- <DIV class=padding>
                                            <DIV id=middlebody> -->
                                        <table cellspacing="0" cellpadding="0" width="100%" border="0">
                                            <tbody>
                                                <tr>
                                                    <td>
                                                        <div align="left">
                                                            |&nbsp;&nbsp;欢迎,d单位用户&nbsp;&nbsp;|&nbsp;&nbsp;
                                                            <a class="table_t"
                                                                href="#/">注销      </a>&nbsp;&nbsp;|&nbsp;&nbsp;<a
                                                                href="javascript:history.go(-1)">后退</a>&nbsp;&nbsp;|
                                                        </div>
                                                    </td>
                                                    <td>
                                                        <div align="center"><a
                                                                href="#/unit/unitinfo">单位信息</a></div>
                                                    </td>
                                                    <td>
                                                        <div align="center"><a
                                                                href="#/unit/reworkpassword">修改密码</a>
                                                        </div>
                                                    </td>
                                                    <td>
                                                        <div align="center"><a
                                                                href="#/unit/showprojectcategory">项目申报管理</a>
                                                        </div>
                                                    </td>
                                                    <td height="50">
                                                        <div align="center"><a
                                                                href="#/unit/simplesearch">信息查询</a>
                                                        </div>
                                                    </td>
                                                </tr>
                                            </tbody>
                                        </table>
                                        <table id="app" width="50%" border="0" cellpadding="0" cellspacing="1">
                                            <tr>
                                                <td width="25%" height="20" align="right" bgcolor="#f3f3f3">用户名
                                                </td>
                                                <td width="2%" align="right" bgcolor="#f3f3f3">&nbsp;</td>
                                                <td width="73%" height="20" align="left" bgcolor="#f3f3f3">
                                                    <div align="left">{{user.username}}</div>
                                                </td>
                                            </tr>
                                            <input type="hidden" value="gary" name="username" />
                                            <tr>
                                                <td height="20" align="right" bgcolor="#f3f3f3">原始密码</td>
                                                <td align="right" bgcolor="#f3f3f3">&nbsp;</td>
                                                <td height="20" align="left" bgcolor="#f3f3f3">
                                                    <div align="left">
                                                        <input id="temp1" type="password" v-model="oldPassword"
                                                             name="password" />
                                                    </div>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td height="20" align="right" bgcolor="#f3f3f3">新密码</td>
                                                <td align="right" bgcolor="#f3f3f3">&nbsp;</td>
                                                <td height="20" align="left" bgcolor="#f3f3f3">
                                                    <div align="left">
                                                        <input id="temp2" type="password" v-model="newPassword"
                                                             name="newpassword" />
                                                    </div>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td height="20" align="right" bgcolor="#f3f3f3">重复新密码</td>
                                                <td align="right" bgcolor="#f3f3f3">&nbsp;</td>
                                                <td height="20" align="left" bgcolor="#f3f3f3">
                                                    <div align="left">
                                                        <input id="temp3" type="password" v-model="newPassword2"
                                                             name="newdoublepassword" />
                                                    </div>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td height="20" colspan="2" align="middle" bgcolor="#f3f3f3">
                                                    &nbsp;</td>
                                                <td height="20" align="middle" bgcolor="#f3f3f3">
                                                    <div align="left">
                                                        <input type="button" @click="updatePassword()" value="确认更改" />
                                                    </div>
                                                </td>
                                            </tr>
                                        </table>
                                        <div></div>
                                        <!--              </form>-->
                                    </td>
                                </tr>
                            </table>
                            <br />
                            <div class="table_wz"></div>
                        </td>
                    </tr>
                </table>
            </div>
        </div>
        <component :is="two"></component>
    </div>
</template>
<script>
    import four from '../../util/four';
    import aaa from '@/components/header.vue'
    import bbb from '@/components/footer.vue'
    export default {
        components: {
            aaa, bbb
        },
        data() {
            return {
                one: 'aaa',
                two: 'bbb',
                user: {},
                oldPassword: "",
                newPassword: "",
                newPassword2: "",
            }
        },
        mounted() {
            this.getUser();
        },
        methods: {
            getUser() {
                let uid = JSON.parse(sessionStorage.getItem("userid"));
                four.get("/users/getById/" + uid).then((res) => {
                    this.user = res.data.data;
                })
            },
            updatePassword() {
                if (this.oldPassword === this.user.password) {
                    if (this.newPassword === this.newPassword2) {
                        this.user.password = this.newPassword;
                        four.put("/users", this.user).then((res) => {
                            if (res.data.code == 20031) {
                                this.$message.success("修改成功！请重新登录！");
                                this.$router.push('/jieshao');
                            }
                            if (res.data.code == 20030) {
                                this.$message.error("修改失败！");
                            }
                        })
                    } else {
                        this.$message.error("两次密码输入不一致！");
                    }
                } else {
                    this.$message.error("原密码错误！");
                }

            }

        }
    }
</script>